var React = require('react');


var Bheader = require('../widget/Bheader');


module.exports = React.createClass({
    getInitialState: function () {
        return {
            theme:"Default",//Default/Blue
            Id:"",
            flag:false,
        }
    },

    componentDidMount: function () {

        var mp = new BMap.Map("allmap");
        mp.centerAndZoom(new BMap.Point(120.19, 30.26), 12);
        mp.centerAndZoom(new BMap.Point(120.25, 30.50), 12);
        mp.enableScrollWheelZoom();
        //定位点1
        var pt1 = new BMap.Point(120.19, 30.26);
        var myIcon = new BMap.Icon("../img/dingwei.png", new BMap.Size(20,20));
        var marker1 = new BMap.Marker(pt1,{icon:myIcon});  // 创建标注
        mp.addOverlay(marker1);              // 将标注添加到地图中
        //定位点2
        var pt2 = new BMap.Point(120.25, 30.50);
        var myIcon = new BMap.Icon("../img/dingwei.png", new BMap.Size(20,20));
        var marker2 = new BMap.Marker(pt2,{icon:myIcon});  // 创建标注
        mp.addOverlay(marker2);

        //创建连线
        var polyline = new BMap.Polyline([
            new BMap.Point(120.19, 30.26),
            new BMap.Point(120.25, 30.50),
            // new BMap.Point(120.19, 30.26)
        ], {strokeColor:"red", strokeWeight:2, strokeOpacity:1});   //创建折线
        mp.addOverlay(polyline);   //增加折线
    },

    render: function () {
        var p = this;
        return (
            <div className="main"  id="main">
                <Bheader theme={this.state.theme} hact="#logistics"  title="物流信息" headr="false" picWord="查看地图"></Bheader>
                <div className="logistics map">
                    <div id="allmap"></div>
                    <ul className="logisticsList">
                        {/*出库*/}
                        <li className="logisticsListItem">
                            <div className="rt fixed">

                                <p>出库</p>
                            </div>
                            <div className="mid fixed">
                                <p>场所：</p>
                                <p>时间：</p>
                                <p>确认与否：</p>
                                <p>目的地：</p>
                            </div>
                            <div className="lt fixed">
                                <p>产地法国</p>
                                <p>2016-03-21</p>
                                <p>是</p>
                                <p>国外仓库</p>
                            </div>
                        </li>
                        {/*入库*/}
                        <li className="logisticsListItem">
                            <div className="rt fixed">

                                <p>入库</p>
                            </div>
                            <div className="mid fixed">
                                <p>场所：</p>
                                <p>时间：</p>
                                <p>确认与否：</p>
                                <p>入库地：</p>
                            </div>
                            <div className="lt fixed">
                                <p>国外仓储</p>
                                <p>2016-03-21</p>
                                <p>是</p>
                                <p>产地法国</p>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        )
    }
});